<template>
  <div class="container-fluid">
    <div class="row school-model school-tiao">
      <div class="col school-tiao-left">
        <span>{{ $route.name }}</span>
      </div>
      <div class="col text-center">
        <router-link class="text-white" :to="{name: '通知公告'}">返回</router-link>
      </div>
    </div>
    <div class="row school-model index-model">
      <div class="col school-col-table">
        <el-row>
          <el-col :span="24">
            <h4 class="text-center">{{data.title}}</h4>
          </el-col>
          <el-col class="text-left" :span="8">
            <span>发送对象：{{user}}</span>
          </el-col>
          <el-col class="text-center" :span="8">
            <span>发送人：{{getschooluserbyid( data.uid).name}}</span>
          </el-col>
          <el-col class="text-right" :span="8">
            <span>布置时间：{{totime(data.starttime )}}</span>
          </el-col>
        </el-row>
        <el-container class="school-homework">
          <div class="mb rounded border" v-html="data.text"></div>
        </el-container>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { totime } from "../../../utils.js";
export default {
  name: "watchannouncement",
  props: ["ID"],
  computed: {
    ...mapGetters([
      "getschooladdress",
      "getschoolstudent",
      "getschoolannouncementpush",
      "getschooluser",
      "getschooluserbyid"
    ]),
    data() {
      return this.getschoolannouncementpush.find(v => v.ID == this.ID);
    },
    user() {
      const { data, getschoolstudent } = this;
      const i = data.schoolannouncementpushstudent.map(v => v.schoolstudentid);
      return getschoolstudent
        .filter(v => i.includes(v.ID))
        .map(v => v.name)
        .join(" ");
    }
  },
  methods: {
    totime
  }
};
</script>

<style lang="scss" scoped>
.index-model {
  margin-top: 13px;
}
.school-homework {
  margin-top: 25px;
}
.mb {
  width: 375px;
  height: 815px;
  padding: 2px;
  overflow: auto;
  margin: 0 auto;
}
</style>